<template>
	<view class="content">
		<uni-forms ref="baseForm" :rules="rules" :modelValue="baseFormData"  label-width="180rpx">
			<uni-forms-item label="车牌号" required name="plateNo">
				<uni-easyinput v-model="baseFormData.plateNo" disabled placeholder="请输入车牌号" />
			</uni-forms-item>
			<uni-forms-item label="预约类型" required name="orderType">
				<uni-data-checkbox v-model="baseFormData.orderType" :localdata="sexs" />
			</uni-forms-item>
			<uni-forms-item label="预约人" required name="contactName">
				<uni-easyinput v-model="baseFormData.contactName" placeholder="请输入预约人姓名" />
			</uni-forms-item>
			<uni-forms-item label="联系方式" required name="mobile">
				<uni-easyinput v-model="baseFormData.mobile" :maxlength="11" placeholder="请输入联系方式" />
		    </uni-forms-item>   
			<uni-forms-item label="到店时间" required name="arrivalTime">
				<uni-datetime-picker type="datetime" return-type="timestamp" v-model="baseFormData.arrivalTime" />
			</uni-forms-item>
			<uni-forms-item label="取车时间">
				<uni-datetime-picker type="datetime" return-type="timestamp" v-model="baseFormData.pickTime" />
			</uni-forms-item>
			<uni-forms-item label="取车地址">
				<uni-easyinput v-model="baseFormData.pickAddress" @focus="chooseAddress(1)" placeholder="请选择取车地址" />
			</uni-forms-item>
			<uni-forms-item label="送车时间">
				<uni-datetime-picker type="datetime" return-type="timestamp" v-model="baseFormData.deliveryTime" />
			</uni-forms-item>
			<uni-forms-item label="交车地址">
				<uni-easyinput v-model="baseFormData.deliveryAddress" @focus="chooseAddress(2)" placeholder="请选择交车地址" />
			</uni-forms-item>
			
			<uni-forms-item label="备注">
				<uni-easyinput v-model="baseFormData.remark" placeholder="请输入备注" />
			</uni-forms-item>
		</uni-forms>
		<u-button type="primary" :plain="true" @click="submit">提交</u-button>
		<u-modal v-model="show" @confirm="confirm" @cancel="show = false" :show-cancel-button="true"  content="确认提交预约吗？"></u-modal>
	</view>
</template>

<script>
	import {
		domain,appointmentReminder
	} from '@/utils/config.js';
	import dayjs from 'dayjs';
	export default {
		data() {
			return {
				show:false,
				baseFormData: {
					orderType:1,
					contactName:'',
					plateNo: "",
					mobile: uni.getStorageSync('ownerMobile'),
					pickTime: null,
					arrivalTime:"",
					pickAddress: '',
					deliveryTime: null,
					deliveryAddress: "",
					remark: "",
					source: "",
					deliveryLatitude:"",
					deliveryLongitude:'',
					pickLatitude:'',
					pickLongitude:''
				},
				sexs: [{
					text: '洗车',
					value: 1
				}, {
					text: '维修',
					value: 2
				}],
				// 校验规则
				rules: {
					contactName: {
						rules: [{
							required: true,
							errorMessage: '预约人不能为空'
						}]
					},
					plateNo: {
						rules: [{
							required: true,
							errorMessage: '车牌号不能为空'
						}]
					},
					mobile: {
						rules: [{
							required: true,
							errorMessage: '联系方式不能为空'
						}]
					},
					arrivalTime: {
						rules: [{
							required: true,
							errorMessage: '到店时间不能为空'
						}]
					}
				},
				openid: uni.getStorageSync('openid'),
				tmplIds: 'SnbotvI9eVttWNM08K5MSpqUPXZQgbYOyPk01VC5Ku8'
			}
		},
		onLoad(options) {
			// #ifdef MP-WEIXIN
			this.baseFormData.source = "weixin";
			const encodedParam = options.param;
			const decodedParam = JSON.parse(decodeURIComponent(encodedParam));
			console.log(decodedParam.plateNo); // 输出: value1
			this.baseFormData.plateNo = decodedParam.plateNo;
			this.baseFormData.contactName = decodedParam.owner;
			console.log(decodedParam.vin); // 输出: value2
			if(!this.openid){
				uni.login({
					success:(e)=>{
						uni.request({
							url:'wxApp/login',
							method:"POST",
							data:{
								code:e.code
							},
							success: (res1) => {
								let userInfo = res1.data.data;
								this.openid = userInfo.openid;
								uni.setStorageSync('openid',userInfo.openid);
								if(userInfo.ownerMobile && userInfo.ownerName){
									uni.setStorageSync('ownerMobile',userInfo.ownerMobile);
									uni.setStorageSync('ownerName',userInfo.ownerName);
								}else{
									uni.navigateTo({
										url: "/pages/user/register",
									})
								}
							}
						})
					}
				})
			}
			// #endif
			// #ifdef H5
			this.baseFormData.source = "H5"
			// #endif
			uni.showShareMenu({
				withShareTicket: true,
				menus: ['shareAppMessage', 'shareTimeline']
			})
		},
		methods: {
			chooseAddress(type = 1) {
				console.log('表单数据信息：');
				let that = this;
				uni.getSetting({
					success(res) {
						console.log(res);
						if (!res.authSetting['scope.userLocation']) {
							console.log("f1")
							uni.authorize({
								scope: 'scope.userLocation',
								success() {
									uni.chooseLocation({
										success: function(res) {
											if(type == 1){
												that.baseFormData.pickName = res.name;
												that.baseFormData.pickAddress = res.address;
												that.baseFormData.pickLatitude = res.latitude;
												that.baseFormData.pickLongitude = res.longitude;
											}
											if(type == 2){
												console.log(res)
												that.baseFormData.deliveryAddress = res.address;
												that.baseFormData.deliveryName = res.name;
												that.baseFormData.deliveryLatitude = res.latitude;
												that.baseFormData.deliveryLongitude = res.longitude;
											}
										},
									})
									console.log('success2')
								},
								fail() {
									console.log("f2")
								}
							})
						} else {
							uni.chooseLocation({
								success: function(res) {
									console.log(res)
									if(type == 1){
										that.baseFormData.pickName = res.name;
										that.baseFormData.pickAddress = res.address;
										that.baseFormData.pickLatitude = res.latitude;
										that.baseFormData.pickLongitude = res.longitude;
									}
									if(type == 2){
										console.log(res)
										that.baseFormData.deliveryName = res.name;
										that.baseFormData.deliveryAddress = res.address;
										that.baseFormData.deliveryLatitude = res.latitude;
										that.baseFormData.deliveryLongitude = res.longitude;
									}
								},
							})
						}
					}
				})
			},
			submit() {
				this.$refs.baseForm.validate().then(res => {
					console.log('表单数据信息：', res);
					// wx.requestSubscribeMessage({ // 调起消息订阅界面
					// 	tmplIds: [this.tmplIds],
					// 	success: (res) => {
					// 		console.log('订阅消息 成功 ');
					// 		console.log(res);
					// 		this.save();
					// 	},
					// 	fail: (res) => {
					// 		console.log("订阅消息 失败 ");
					// 		console.log(er);
					// 		this.save();
					// 	}
					// })
					this.show = true;

				}).catch(err => {
					console.log('表单错误信息：', err);
				})
			},
			confirm(){
				this.save();
			},
			save() {
				uni.request({
					url:  "reserve/save",
					method: "POST",
					data: {
						...this.baseFormData,
						openid: this.openid,
						reserveTime: dayjs(new Date()).format('YYYY-MM-DD HH:mm:ss'),
						pickTime: this.baseFormData.pickTime ? dayjs(this.baseFormData.pickTime).format(
							'YYYY-MM-DD HH:mm:ss') : null,
						deliveryTime: this.baseFormData.deliveryTime ? dayjs(this.baseFormData.deliveryTime)
							.format('YYYY-MM-DD HH:mm:ss') : null,
						templateData: appointmentReminder(this.baseFormData),
					},
					success: (res) => {
						console.log(res)
						if (res.data.ok) {
							uni.showToast({
								title: '预约成功',
								duration: 2000,
							});
							uni.switchTab({
								url:"/pages/reserve/list"
							})
						}
					}
				})
			}
		}
	}
</script>

<style scoped lang="less">
	.content {
		padding: 0 30rpx;
	}
</style>